﻿@{
    ViewData["Title"] = "MoveAdd";
    Layout = "~/Views/Shared/Template.cshtml";
}

<h4>新增移库单</h4>

<form class="layui-form" action="/CreateWarehouse">
    <div class="layui-form-item" style="margin-left:150px;margin-top:50px">
        <div class="layui-inline">
            <label class="layui-form-label">移库单号</label>
            <div class="layui-input-inline">
                <input type="text" name="moveTheLibraryNo" id="moveTheLibraryNo" lay-verify="required" autocomplete="off" placeholder="可不填写，自动生成" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">移库单类型</label>
            <div class="layui-input-inline">
                <select id="moveTheLibraryType" name="moveTheLibraryType" lay-filter="aihao">
                    <option value="">请选择入库类别</option>
                    <option value="移库上架">移库上架</option>
                    <option value="仓库移库">仓库移库</option>
                    <option value="报损移库">报损移库</option>
                </select>
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">关联订单号</label>
            <div class="layui-input-inline">
                <input type="text" name="associateNumber" autocomplete="off" class="layui-input">
            </div>
        </div>
    </div>



    <div class="layui-form-item" style="margin-left:150px;margin-top:50px">
        <div class="layui-inline">
            <label class="layui-form-label">制单人</label>
            <div class="layui-input-inline">
                <input type="text" name="singleMaker" lay-verify="required" autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">制单时间</label>
            <div class="layui-input-inline">
                <input type="datetime-local" name="makeTime" id="singleTime" autocomplete="off" class="layui-input">
            </div>
        </div>
    </div>
    <div class="layui-form-item layui-form-text" style="margin-left:130px;margin-top:30px">
        <label class="layui-form-label">备注</label>
        <div class="layui-input-block">
            <textarea name="moveRemark" placeholder="请输入内容" class="layui-textarea"></textarea>
        </div>
    </div>
    <div style="float:left;margin-top:40px;margin-bottom:40px">
        <h4>产品信息</h4>
    </div>
    <div style="float:right;margin-top:40px;margin-bottom:40px">
        <button type="button" class="layui-btn layui-bg-gray" lay-on="test-page-custom">
            <i class="layui-icon layui-icon-add-1"></i>新增产品
        </button>
    </div>
    <table class="layui-hide" id="moveProduct"></table>
    <div class="layui-form-item" style="text-align:center;margin-top:50px">
        <button class="layui-btn" lay-submit lay-filter="demo2">提交</button>
        <button type="reset" class="layui-btn layui-btn-primary" onclick="location.href='/Warehouse/MoveShow'">取消</button>
    </div>
</form>
<script src="~/js/warehouse/move/moveadd.js"></script>


<script>



    $(function () {
        generateDate();//自动生成时间
    });

    layui.use(function () {
        var $ = layui.$;
        var layer = layui.layer;
        var util = layui.util;
        var form = layui.form;


        // 定义获取选中复选框值的函数
        function getCheckedCheckboxValues() {
            var checkedCheckboxValues = [];
            $("input[name='ckbproc']:checked").each(function () {
                checkedCheckboxValues.push($(this).val());
            });
            return checkedCheckboxValues;
            console.log(checkedCheckboxValues);
        }

        // 事件
        util.on('lay-on', {
            'test-page-custom': function () {
                layer.open({
                    type: 1,
                    area: ['950px', '600px'],
                    resize: false,
                    shadeClose: true,
                    title: '选择产品',
                    content: `
                                        <form class="layui-form" action="">
                                     <div class="layui-form-item">
                                         <div class="layui-inline">
                                             <label class="layui-form-label">产品编号:</label>
                                             <div class="layui-input-block">
                                                 <input type="text" id="productNo" name="productNo" placeholder="请输入" autocomplete="off" class="layui-input">
                                             </div>
                                         </div>
                                         <div class="layui-inline">
                                             <label class="layui-form-label">产品名称:</label>
                                             <div class="layui-input-block">
                                                 <input type="text" id="productName" name="productName" placeholder="请输入" autocomplete="off" class="layui-input">
                                             </div>
                                         </div>
                                         <div class="layui-inline">
                                             <div class="layui-btn-container">
                                                 <button type="button" class="layui-btn layui-bg-blue" onclick="Fenye()">
                                                     <i class="layui-icon layui-icon-search"></i>搜索
                                                 </button>
                                             </div>
                                         </div>
                                     </div>
                                 </form>
                                 <div>
                                 <table class="layui-table">
                                 <tr>
                                     <th>
                                         <input type="checkbox" id="checkAll" onclick="checkAll()" value="" />
                                    </th>
                                     <th>产品编号</th>
                                     <th>产品名称</th>
                                     <th>规格</th>
                                     <th>类别</th>
                                     <th>存储单位</th>
                                     <th>包装类型</th>
                                     <th>价格</th>
                                     <th>重量</th>
                                     <th>显示名</th>
                                 </tr>
                                 <tbody id="data"></tbody>
                             </table>
                                 </div>
                                 <div id="demo-laypage-layout"></div>
                                 <div style="text-align:right;margin-top:30px">
                                 <button type="button" class="layui-btn layui-btn-primary layui-btn-sm" id="closePopupBtn" onclick="close()">
                                                     关闭
                                                 </button>
                                 <button type="button" class="layui-btn layui-bg-blue layui-btn-sm" >
                                                     选择
                                                 </button>
                                 </div>`,
                    success: function () {
                        // 对弹层中的表单进行初始化渲染
                        form.render();
                        // 表单提交事件
                        form.on('submit(demo-login)', function (data) {
                            var field = data.field; // 获取表单字段值
                            return false; // 阻止默认 form 跳转
                        });

                        //获取复选框值
                        var chooseButton = $(".layui-btn.layui-bg-blue:last");
                        chooseButton.on('click', function () {
                            var checkedValues = getCheckedCheckboxValues();
                            if (checkedValues.length > 0) {
                                idsArray = checkedValues
                                console.log("选中的复选框值:", checkedValues, idsArray);
                                layer.close(index);
                                //显示
                                layui.use('table', function () {
                                    var form = layui.form;
                                    var table = layui.table;
                                    $.ajax({
                                        url: '../Product/GetProductRangeModel',
                                        type: 'post',
                                        data: {
                                            productId: JSON.stringify(idsArray),
                                            token: localStorage.getItem("token")
                                        },
                                        success: function (res) {
                                            var res = JSON.parse(res)
                                            console.log(res.data)
                                            console.log(idsArray)
                                            // res 是从后端获取到的 JSON 数据
                                            if (res.code === 0) {
                                                console.log(res.data);
                                                table.render({
                                                    elem: moveProduct, // 对应 HTML 中表格的 id
                                                    data: res.data, // 绑定获取到的数据
                                                    // page: true,
                                                    // limit: 5,
                                                    // limits: [5, 8, 10],
                                                    cols: [[
                                                        { type: 'checkbox', fixed: 'left' },
                                                        { field: 'productName', title: '产品名称' },
                                                        { field: 'productNo', title: '产品编号' },
                                                        { field: 'productSpec', title: '规格' },
                                                        {
                                                            field: 'batch', title: '批次',
                                                            templet: function () {
                                                                return '20241119';
                                                            }
                                                        },
                                                        {field: 'price',title: '单价'},
                                                        { field: 'outStorageNum', edit: 'text', title: '数量' },
                                                       
                                                        {
                                                            field: 'binLocationName', title: '当前库位',
                                                            templet: function () {
                                                                return '仓库2:默认正式库位';
                                                            }
                                                        },
                                                        { field: 'newBinLocationName', edit: 'text', title: '移入库位' },
                                                        {
                                                            field: '', title: '操作', width: 200, templet: function (d) {
                                                                return '<a class="layui-btn layui-btn-edit layui-btn-xs" lay-on="test-page-delete"><i class="layui-icon layui-icon-edit"></i>删除</a> ';
                                                            }
                                                        }
                                                    ]],
                                                })
                                            } else {
                                                console.log(res.msg);
                                            }

                                        },
                                        error: function () {
                                            console.log('获取数据失败');
                                        }
                                    });
                                });
                                console.log("选中的复选框值:", checkedValues, idsArray);
                            } else {
                                layer.msg("请至少选择一项");
                            }
                        });
                        //关闭弹窗
                        close = function () {
                            layer.close(index);
                        }
                    }
                });
                var index = 1;
                var size = 6;
                var tacount = 0;
                $(function () {
                    Fenye();
                });
                //弹窗显示
                Show = function () {
                    var productNo = $("#productNo").val();
                    var productName = $("#productName").val();
                    var manuNo = $("#manuNo").val();
                    var vendorId = $("#vendorId").val();
                    $.ajax({
                        url: '../Product/GEtProductShow',
                        async: false,//改为异步,
                        type: 'get',
                        data: {
                            productNo: productNo,
                            productName: productName,
                            manuNo: manuNo,
                            vendorId: vendorId,
                            index: index,
                            size, size,
                            token: localStorage.getItem("token")
                        },
                        success: function (res) {
                            var list = '';
                            var parsedData = JSON.parse(res);
                            console.log(parsedData)
                            $(parsedData.data.list).each(function () {
                                list += `
                                     <tr>
                                    <td>
                                            <input type="checkbox" name="ckbproc" value="${this.productId}" />
                                        </td>
                                     <td>${this.productNo}</td>
                                      <td>${this.productName}</td>
                                      <td>${this.productSpec}</td>
                                      <td>${this.productTypeName}</td>
                                      <td>${this.productSpec}</td>
                                      <td>${this.productWrap}</td>
                                      <td>${this.price}</td>
                                      <td>${this.productWeight}</td>
                                              <td>

                                                </td>
                                 </tr> `
                            });
                            $("#data").html(list);
                            tacount = parsedData.data.tacount;
                        }
                    })
                }

                //分页
                Fenye = function () {

                    layui.use(function () {
                        var laypage = layui.laypage;
                        // 完整显示
                        Show()
                        laypage.render({
                            elem: 'demo-laypage-layout', // 元素 id
                            count: tacount, // 数据总数
                            limit: size,//2.设置默认分页大小
                            limits: [6, 10, 15],//3.设置分页组件可选的分页大小
                            layout: ['count', 'prev', 'page', 'next', 'limit', 'refresh', 'skip'], // 功能布局
                            jump: function (obj) {
                                console.log(obj);
                                index = obj.curr;
                                size = obj.limit;
                                Show();
                            }
                        });
                    });
                }
                checkpll = function () {
                    var checkedIds = $("input[name='ckbproc']:checked");//取所有选中的name=ckbproc的复选框集合
                    var ids = [];//定义了一个数组,空的
                    $(checkedIds).each(function (i, obj) {
                        var id = $(obj).val();
                        ids.push(id);//往数组里push数字,数字就是我们的商品id
                    });

                    console.log(ids)
                }
                checkAll = function () {

                    var checked = $("#checkAll").prop("checked");  //取全选/反选 checkbox的选中状态值
                    $("input[name='ckbproc']").prop("checked", checked);//把所有name=ckbproc的checkbox的选中状态赋值为 checked
                    console.log(checked)
                }
            }
        })
    });


    //自动生成时间
    function generateDate() {
        var n = new Date();
        var ss = n.getFullYear() + (n.getMonth() + 1).toString().padStart(2, '0') +
            n.getDate().toString().padStart(2, '0') +
            n.getHours().toString().padStart(2, '0') +
            n.getMinutes().toString().padStart(2, '0') +
            n.getSeconds().toString().padStart(2, '0');
        $("#moveTheLibraryNo").val(ss);
    }

    // 表单提交事件
    layui.use(['layer', 'form', 'util', 'table'], function () {
        var layer = layui.layer;
        var $ = layui.jquery;
        var form = layui.form;
        var util = layui.util;
        var table = layui.table;

        form.on('submit(demo2)', function (data) {
            var field = data.field;
            var checkStatus = table.checkStatus('moveProduct');
            field.moveProduct = checkStatus.data.map(function (item) {
                return item;
            });
            console.log(field);//field.products
            // 显示填写结果，仅作演示用
            $.ajax({
                url: '/Warehouse/GetMoveAdd',
                type: 'post',
                data: {
                    field: field,
                    token: localStorage.getItem("token"),
                },
                success: function (res) {
                    var res = JSON.parse(res)
                    console.log(field);
                    console.log(res);
                    if (res.code == 0) {
                        layer.alert("添加成功");
                        //跳转页面
                        //location.href = '/Warehouse/MoveShow'
                    } else {
                        layer.alert("添加失败");
                    }
                }
            });

            return false; // 阻止默认 form 跳转
        });
    });

    // 定义时间格式转换函数
    function formatTime(timeStamp) {
        if (timeStamp) {
            var date = new Date(timeStamp);
            var year = date.getFullYear();
            var month = ('0' + (date.getMonth() + 1)).slice(-2);
            var day = ('0' + date.getDate()).slice(-2);
            var hour = ('0' + date.getHours()).slice(-2);
            var minute = ('0' + date.getMinutes()).slice(-2);
            var second = ('0' + date.getSeconds()).slice(-2);
            return year + '-' + month + '-' + day + ' ' + hour + ':' + minute + ':' + second;
        }
        return "";
    }
</script>